﻿@inherits FoodNodeBase

<ul class="s-food s-food-menu ms-3" @ref="FoodMenuElement">
    @foreach (var food in Items)
    {
        <li class="food-item">
            <div class="food-header" @onclick="() => Toggle(IndexOf(food), food)">
                <i class="@GetCaretClassString(food)"></i>
                <span class="food-text">@food.Name</span>
                <div class="food-toolbar">
                    <i class="fa fa-edit" @onclick:stopPropagation @onclick="() => Update(food)"></i>
                    <i class="fa fa-plus" @onclick:stopPropagation @onclick="() => Add(food)"></i>
                    <i class="fa fa-minus" @onclick:stopPropagation @onclick="() => Delete(food)"></i>
                    <i class="fa fa-chevron-up" @onclick:stopPropagation @onclick="() => MovePrev(food)"></i>
                    <i class="fa fa-chevron-circle-up" @onclick:stopPropagation @onclick="() => MoveFirst(food)"></i>
                    <i class="fa fa-chevron-circle-down" @onclick:stopPropagation @onclick="() => MoveLast(food)"></i>
                    <i class="fa fa-chevron-down" @onclick:stopPropagation @onclick="() => MoveNext(food)"></i>
                </div>
            </div>
            @if (food.Ingredients != null && food.Ingredients.Any())
            {
                <div class="table-ingre food-ingre">
                    <IngredientTable Value="food" />
                </div>
            }
        </li>
    }
</ul>
